<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:wicket="http://wicket.apache.org/dtds.data/wicket-xhtml1.4-strict.dtd">

<head>
	<link rel="stylesheet" type="text/css" href="css/stylesheet.css"/>
	<link rel="stylesheet" type="text/css" href="css/bootstrap-responsive.css"/>
	<link rel="stylesheet" type="text/css" href="css/mystyle.css"/>
	<script type="text/javascript" src ="js/numberFormat.js"></script>
	<script type="text/javascript" src="js/bootstrap-modal.js"></script>
	<script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/bootstrap-transition.js"></script>
    <script type="text/javascript" src="js/bootstrap-alert.js"></script>
    <script type="text/javascript" src="js/bootstrap-dropdown.js"></script>
    <script type="text/javascript" src="js/bootstrap-scrollspy.js"></script>
    <script type="text/javascript" src="js/bootstrap-tab.js"></script>
    <script type="text/javascript" src="js/bootstrap-tooltip.js"></script>
    <script type="text/javascript" src="js/bootstrap-popover.js"></script>
    <script type="text/javascript" src="js/bootstrap-button.js"></script>
    <script type="text/javascript" src="js/bootstrap-collapse.js"></script>
    <script type="text/javascript" src="js/bootstrap-carousel.js"></script>
    <script type="text/javascript" src="js/bootstrap-typeahead.js"></script>
</head>

<body>
	<div id="header" class="container">
	
		<style type="text/css">
     		body {
        		padding-top: 20px;
        		padding-bottom: 40px;
      		}
    	</style>
    	
    	<!-- Main hero unit for a primary marketing message or call to action -->
      <div class="hero-unit">
        <div class="row">
          <div class="span4">
            <img wicket:id="logo" class="thumbnail">
          </div>
          <div class="span4">
            <h1>Welcome!</h1>
          </div>
        </div>
        <p>The Babushka team is trying to create the most interesting collection of handmade products</p>
        <a href="#contactus" role="button" class="btn btn-primary btn-large" data-toggle="modal">Contact us</a>
      </div>

      <h4> If you want to stay in touch and receive our newsletter please enter your mail below </h4>

    <!---Contact us modal-->

    <div id="contactus" class="modal hide fade">
      <div class="modal-header">
        <h3>Contact information</h3>
      </div>
      <div class="modal-body">
        <p>You can submit your questions/requests in: thebabushka@mail.gr</p>
        <p>or alternatively call us in: +306985074679</p>
      </div>
      <div class="modal-footer">
        <button class="btn btn-primary" data-dismiss="modal" aria-hidden="true">Close</button>
      </div>
    </div>

<!--end of contact us modal-->
	<div wicket:id="feedbackPanel" />
	<div wicket:id="newsLetterPanel" />
</div>
</body>
</html>	